<!DOCTYPE html>
<html>
<head>
  <!-- Standard Meta -->
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">

<link rel="image_src" type="image/jpeg" href="/images/logo.png" />

<!-- Site Properities -->
<meta name="generator" content="DocPad v6.79.4" />
<title>Flag | Semantic UI</title>

<meta name="description" content="A flag is used to represent a political state" />
<meta name="keywords" content="html5, ui, library, framework, javascript" />
  
  <script src="/javascript/library/detect.min.js"></script>
  <script src="/javascript/library/jquery.min.js"></script>
  <script src="/javascript/library/clipboard.min.js"></script>
  <script src="/javascript/library/cookie.min.js"></script>
  <script src="/javascript/library/easing.min.js"></script>
  <script src="/javascript/library/highlight.min.js"></script>
  <script src="/javascript/library/history.min.js"></script>
  <script src="/javascript/library/state.js"></script>
  <script src="/javascript/library/tablesort.min.js"></script>
  <script src="/javascript/library/underscore.min.js"></script>





<script src="/dist/semantic.min.js"></script>



<script src="/javascript/docs.js"></script>

  
<link rel="stylesheet" type="text/css" class="ui" href="/dist/semantic.min.css">




<link rel="stylesheet" type="text/css" href="/stylesheets/docs.css">
<link rel="stylesheet" type="text/css" href="/stylesheets/rtl.css">





  
<script>
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

  ga('create', 'UA-44039803-2', 'auto');
  ga('send', 'pageview');
</script>

  
<script type="text/javascript">
  window.liveSettings = {
    api_key    : '9ede3015b9f84c1aabc81ab839c55d74',
    parse_attr : [
      'data-title',
      'data-content'
    ],
    detectlang   : false,
    autocollect  : true,
    ignore_tags  : ['i', 'code', 'pre'],
    parse_attr   : ['data-title', 'data-content', 'data-text'],
    ignore_class : ['code', 'anchor']
  };
</script>
<script type="text/javascript" src="//cdn.transifex.com/live.js"></script>


</head>
<body id="example" class="flag-page" ontouchstart="">
  
  <div class="ui vertical inverted sidebar menu" id="toc">
  








<div class="item">
  <a class="ui logo icon image" href="/">
    <img src="/images/logo.png">
  </a>
  <a href="/"><b>UI Docs</b></a>
</div>
<a class="item" href="/introduction/getting-started.html">
  <b>Getting Started</b>
</a>
<a class="item" href="/introduction/new.html">
  <b>New in 2.4</b>
</a>
<div class="item">
  <div class="header">Introduction</div>
  <div class="menu">
    
      <a class="item" href="/introduction/integrations.html">
        Integrations
      </a>
    
      <a class="item" href="/introduction/build-tools.html">
        Build Tools
      </a>
    
      <a class="item" href="/introduction/advanced-usage.html">
        Recipes
      </a>
    
      <a class="item" href="/introduction/glossary.html">
        Glossary
      </a>
    
  </div>
</div>
<div class="item">
  <div class="header">Usage</div>
  <div class="menu">
    
      <a class="item" href="/usage/theming.html">
        Theming
      </a>
    
      <a class="item" href="/usage/layout.html">
        Layouts
      </a>
    
  </div>
</div>
<div class="item">
  <div class=" header">Globals</div>
  <div class="menu">
    
      <a class="item" href="/globals/reset.html">
        Reset
        
      </a>
    
      <a class="item" href="/globals/site.html">
        Site
        
      </a>
    
  </div>
</div>
<div class="item">
  <div class="active  header">Elements</div>
  <div class="menu">
    
      <a class="item" href="/elements/button.html">
        Button
        
      </a>
    
      <a class="item" href="/elements/container.html">
        Container
        
      </a>
    
      <a class="item" href="/elements/divider.html">
        Divider
        
      </a>
    
      <a class="active item" href="/elements/flag.html">
        Flag
        
      </a>
    
      <a class="item" href="/elements/header.html">
        Header
        
      </a>
    
      <a class="item" href="/elements/icon.html">
        Icon
        
      </a>
    
      <a class="item" href="/elements/image.html">
        Image
        
      </a>
    
      <a class="item" href="/elements/input.html">
        Input
        
      </a>
    
      <a class="item" href="/elements/label.html">
        Label
        
      </a>
    
      <a class="item" href="/elements/list.html">
        List
        
      </a>
    
      <a class="item" href="/elements/loader.html">
        Loader
        
      </a>
    
      <a class="item" href="/elements/placeholder.html">
        Placeholder
        
      </a>
    
      <a class="item" href="/elements/rail.html">
        Rail
        
      </a>
    
      <a class="item" href="/elements/reveal.html">
        Reveal
        
      </a>
    
      <a class="item" href="/elements/segment.html">
        Segment
        
      </a>
    
      <a class="item" href="/elements/step.html">
        Step
        
      </a>
    
  </div>
</div>
<div class="item">
  <div class=" header">Collections</div>
  <div class="menu">
    
      <a class="item" href="/collections/breadcrumb.html">
        Breadcrumb
        
      </a>
    
      <a class="item" href="/collections/form.html">
        Form
        
      </a>
    
      <a class="item" href="/collections/grid.html">
        Grid
        
      </a>
    
      <a class="item" href="/collections/menu.html">
        Menu
        
      </a>
    
      <a class="item" href="/collections/message.html">
        Message
        
      </a>
    
      <a class="item" href="/collections/table.html">
        Table
        
      </a>
    
  </div>
</div>
<div class="item">
  <div class=" header">Views</div>
  <div class="menu">
    
      <a class="item" href="/views/advertisement.html">
        Advertisement
        
      </a>
    
      <a class="item" href="/views/card.html">
        Card
        
      </a>
    
      <a class="item" href="/views/comment.html">
        Comment
        
      </a>
    
      <a class="item" href="/views/feed.html">
        Feed
        
      </a>
    
      <a class="item" href="/views/item.html">
        Item
        
      </a>
    
      <a class="item" href="/views/statistic.html">
        Statistic
        
      </a>
    
  </div>
</div>
<div class="item">
  <div class=" header">Modules</div>
  <div class="menu">
    
      <a class="item" href="/modules/accordion.html">
        Accordion
        
      </a>
  
      <a class="item" href="/modules/checkbox.html">
        Checkbox
        
      </a>
  
      <a class="item" href="/modules/dimmer.html">
        Dimmer
        
      </a>
  
      <a class="item" href="/modules/dropdown.html">
        Dropdown
        
      </a>
  
      <a class="item" href="/modules/embed.html">
        Embed
        
      </a>
  
      <a class="item" href="/modules/modal.html">
        Modal
        
      </a>
  
      <a class="item" href="/modules/popup.html">
        Popup
        
      </a>
  
      <a class="item" href="/modules/progress.html">
        Progress
        
      </a>
  
      <a class="item" href="/modules/rating.html">
        Rating
        
      </a>
  
      <a class="item" href="/modules/search.html">
        Search
        
      </a>
  
      <a class="item" href="/modules/shape.html">
        Shape
        
      </a>
  
      <a class="item" href="/modules/sidebar.html">
        Sidebar
        
      </a>
  
      <a class="item" href="/modules/sticky.html">
        Sticky
        
      </a>
  
      <a class="item" href="/modules/tab.html">
        Tab
        
      </a>
  
      <a class="item" href="/modules/transition.html">
        Transition
        
      </a>
  
  </div>
</div>
<div class="item">
  <div class=" header">Behaviors</div>
  <div class="menu">
    
      <a class="item" href="/behaviors/api.html">
        API
        
      </a>
    
      <a class="item" href="/behaviors/form.html">
        Form Validation
        
      </a>
    
      <a class="item" href="/behaviors/visibility.html">
        Visibility
        
      </a>
    
  </div>
</div>

</div>

<div class="ui black big launch right attached fixed button">
  <i class="content icon"></i>
  <span class="text">Menu</span>
</div>
  




<div class="ui fixed inverted main menu">
  <div class="ui container">
    <a class="launch icon item">
      <i class="content icon"></i>
    </a>
    
      <div class="item">
        Flag
      </div>
    
    <div class="right menu">
      
      <div class="vertically fitted borderless item">
        <iframe class="github" src="//ghbtns.com/github-btn.html?user=semantic-org&amp;repo=semantic-ui&amp;type=watch&amp;count=true" allowtransparency="true" frameborder="0" scrolling="0" width="100" height="20"></iframe>
      </div>
      
      <!--
      <div class="item">
        <div class="ui hidden right aligned search input" id="search">
          <div class="ui transparent icon input">
            <input class="prompt" type="text" placeholder="Search...">
            <i class="inverted search link icon" data-content="Search UI"></i>
          </div>
          <div class="results"></div>
        </div>
      </div>
      -->
    </div>
  </div>
</div>

  <div class="pusher">
    <div class="full height">
      <div class="toc">
        <div class="ui vertical inverted menu">
          








<div class="item">
  <a class="ui logo icon image" href="/">
    <img src="/images/logo.png">
  </a>
  <a href="/"><b>UI Docs</b></a>
</div>
<a class="item" href="/introduction/getting-started.html">
  <b>Getting Started</b>
</a>
<a class="item" href="/introduction/new.html">
  <b>New in 2.4</b>
</a>
<div class="item">
  <div class="header">Introduction</div>
  <div class="menu">
    
      <a class="item" href="/introduction/integrations.html">
        Integrations
      </a>
    
      <a class="item" href="/introduction/build-tools.html">
        Build Tools
      </a>
    
      <a class="item" href="/introduction/advanced-usage.html">
        Recipes
      </a>
    
      <a class="item" href="/introduction/glossary.html">
        Glossary
      </a>
    
  </div>
</div>
<div class="item">
  <div class="header">Usage</div>
  <div class="menu">
    
      <a class="item" href="/usage/theming.html">
        Theming
      </a>
    
      <a class="item" href="/usage/layout.html">
        Layouts
      </a>
    
  </div>
</div>
<div class="item">
  <div class=" header">Globals</div>
  <div class="menu">
    
      <a class="item" href="/globals/reset.html">
        Reset
        
      </a>
    
      <a class="item" href="/globals/site.html">
        Site
        
      </a>
    
  </div>
</div>
<div class="item">
  <div class="active  header">Elements</div>
  <div class="menu">
    
      <a class="item" href="/elements/button.html">
        Button
        
      </a>
    
      <a class="item" href="/elements/container.html">
        Container
        
      </a>
    
      <a class="item" href="/elements/divider.html">
        Divider
        
      </a>
    
      <a class="active item" href="/elements/flag.html">
        Flag
        
      </a>
    
      <a class="item" href="/elements/header.html">
        Header
        
      </a>
    
      <a class="item" href="/elements/icon.html">
        Icon
        
      </a>
    
      <a class="item" href="/elements/image.html">
        Image
        
      </a>
    
      <a class="item" href="/elements/input.html">
        Input
        
      </a>
    
      <a class="item" href="/elements/label.html">
        Label
        
      </a>
    
      <a class="item" href="/elements/list.html">
        List
        
      </a>
    
      <a class="item" href="/elements/loader.html">
        Loader
        
      </a>
    
      <a class="item" href="/elements/placeholder.html">
        Placeholder
        
      </a>
    
      <a class="item" href="/elements/rail.html">
        Rail
        
      </a>
    
      <a class="item" href="/elements/reveal.html">
        Reveal
        
      </a>
    
      <a class="item" href="/elements/segment.html">
        Segment
        
      </a>
    
      <a class="item" href="/elements/step.html">
        Step
        
      </a>
    
  </div>
</div>
<div class="item">
  <div class=" header">Collections</div>
  <div class="menu">
    
      <a class="item" href="/collections/breadcrumb.html">
        Breadcrumb
        
      </a>
    
      <a class="item" href="/collections/form.html">
        Form
        
      </a>
    
      <a class="item" href="/collections/grid.html">
        Grid
        
      </a>
    
      <a class="item" href="/collections/menu.html">
        Menu
        
      </a>
    
      <a class="item" href="/collections/message.html">
        Message
        
      </a>
    
      <a class="item" href="/collections/table.html">
        Table
        
      </a>
    
  </div>
</div>
<div class="item">
  <div class=" header">Views</div>
  <div class="menu">
    
      <a class="item" href="/views/advertisement.html">
        Advertisement
        
      </a>
    
      <a class="item" href="/views/card.html">
        Card
        
      </a>
    
      <a class="item" href="/views/comment.html">
        Comment
        
      </a>
    
      <a class="item" href="/views/feed.html">
        Feed
        
      </a>
    
      <a class="item" href="/views/item.html">
        Item
        
      </a>
    
      <a class="item" href="/views/statistic.html">
        Statistic
        
      </a>
    
  </div>
</div>
<div class="item">
  <div class=" header">Modules</div>
  <div class="menu">
    
      <a class="item" href="/modules/accordion.html">
        Accordion
        
      </a>
  
      <a class="item" href="/modules/checkbox.html">
        Checkbox
        
      </a>
  
      <a class="item" href="/modules/dimmer.html">
        Dimmer
        
      </a>
  
      <a class="item" href="/modules/dropdown.html">
        Dropdown
        
      </a>
  
      <a class="item" href="/modules/embed.html">
        Embed
        
      </a>
  
      <a class="item" href="/modules/modal.html">
        Modal
        
      </a>
  
      <a class="item" href="/modules/popup.html">
        Popup
        
      </a>
  
      <a class="item" href="/modules/progress.html">
        Progress
        
      </a>
  
      <a class="item" href="/modules/rating.html">
        Rating
        
      </a>
  
      <a class="item" href="/modules/search.html">
        Search
        
      </a>
  
      <a class="item" href="/modules/shape.html">
        Shape
        
      </a>
  
      <a class="item" href="/modules/sidebar.html">
        Sidebar
        
      </a>
  
      <a class="item" href="/modules/sticky.html">
        Sticky
        
      </a>
  
      <a class="item" href="/modules/tab.html">
        Tab
        
      </a>
  
      <a class="item" href="/modules/transition.html">
        Transition
        
      </a>
  
  </div>
</div>
<div class="item">
  <div class=" header">Behaviors</div>
  <div class="menu">
    
      <a class="item" href="/behaviors/api.html">
        API
        
      </a>
    
      <a class="item" href="/behaviors/form.html">
        Form Validation
        
      </a>
    
      <a class="item" href="/behaviors/visibility.html">
        Visibility
        
      </a>
    
  </div>
</div>

        </div>
      </div>
      <div class="article">
        <link rel="stylesheet/less" type="text/css" href="/src/definitions/elements/flag.less" />



<div class="ui masthead vertical segment">
  <div class="ui container">
    <div class="introduction">

      <h1 class="ui header">
        Flag
        
        <div class="sub header">
          
          <a class="twitter-share-button twitter"
            href="http://twitter.com/share"
            data-text="Semantic UI is a next generation UI framework"
            data-url="http://semantic-ui.com"
            data-via="semanticui">
          </a>
          <script type="text/javascript">
          window.twttr=(function(d,s,id){var t,js,fjs=d.getElementsByTagName(s)[0];if(d.getElementById(id)){return}js=d.createElement(s);js.id=id;js.src="https://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);return window.twttr||(t={_e:[],ready:function(f){t._e.push(f)}})}(document,"script","twitter-wjs"));
          </script>
          <iframe class="github" src="//ghbtns.com/github-btn.html?user=semantic-org&amp;repo=semantic-ui&amp;type=watch&amp;count=true" allowtransparency="true" frameborder="0" scrolling="0" width="100" height="20"></iframe>
          
          A flag is used to represent a political state
        </div>
      </h1>

      <div class="ui hidden divider"></div>

      <div class="ui right floated main menu">
        <a class="bug popup icon item" data-content="Edit This Page" href="https://github.com/Semantic-Org/Semantic-UI-Docs/edit/master/server/documents/elements/flag.html.eco">
          <i class="edit icon"></i>
        </a>
        
        <a class="bug popup icon item" data-content="Submit Bug Report" href="https://github.com/Semantic-Org/Semantic-UI/issues/new?title=[Flag] - Your Bug Name&body=**Steps to Reproduce**%0A1. Do something%0A2. Do something else.%0A3. Do one last thing.%0A%0A**Expected**%0AThe Flag should do this%0A%0A**Result**%0AThe Flag does not do this%0A%0A**Testcase**%0A(fork this to get started)%0Ahttp://jsfiddle.net/rduvhn8u/1/">
          <i class="bug icon"></i>
        </a>
        
        <a class="github popup icon item" data-content="View project on GitHub" href="https://github.com/Semantic-Org/Semantic-UI">
          <i class="alternate github icon"></i>
        </a>
      </div>
      <div class="ui right floated main menu">
        <a class="music popup icon item" data-content="Play Music">
          <i class="music icon"></i>
        </a>
        <div class="ui language dropdown right floating icon item" id="languages" data-content="Select Language">
          <i class="world icon"></i>
          <div class="menu">
            <div class="header">Select Language</div>
            <div class="ui icon search input">
              <i class="search icon"></i>
              <input type="text" placeholder="Search languages...">
            </div>
            <div class="scrolling menu">
  <div class="item" data-percent="100" data-value="en" data-english="English">
    <span class="description">English</span>
    English
  </div>
  <div class="item" data-percent="94" data-value="da" data-english="Danish">
    <span class="description">dansk</span>
    Danish
  </div>
  <div class="item" data-percent="94" data-value="es" data-english="Spanish">
    <span class="description">Español</span>
    Spanish
  </div>
  <div class="item" data-percent="34" data-value="zh" data-english="Chinese">
    <span class="description">简体中文</span>
    Chinese
  </div>
  <div class="item" data-percent="54" data-value="zh_TW" data-english="Chinese (Taiwan)">
    <span class="description">中文 (臺灣)</span>
    Chinese (Taiwan)
  </div>
  <div class="item" data-percent="79" data-value="fa" data-english="Persian">
    <span class="description">پارسی</span>
    Persian
  </div>
  <div class="item" data-percent="41" data-value="fr" data-english="French">
    <span class="description">Français</span>
    French
  </div>
  <div class="item" data-percent="37" data-value="el" data-english="Greek">
    <span class="description">ελληνικά</span>
    Greek
  </div>
  <div class="item" data-percent="37" data-value="ru" data-english="Russian">
    <span class="description">Русский</span>
    Russian
  </div>
  <div class="item" data-percent="36" data-value="de" data-english="German">
    <span class="description">Deutsch</span>
    German
  </div>
  <div class="item" data-percent="23" data-value="it" data-english="Italian">
    <span class="description">Italiano</span>
    Italian
  </div>
  <div class="item" data-percent="21" data-value="nl" data-english="Dutch">
    <span class="description">Nederlands</span>
    Dutch
  </div>
  <div class="item" data-percent="19" data-value="pt_BR" data-english="Portuguese">
    <span class="description">Português(BR)</span>
    Portuguese
  </div>
  <div class="item" data-percent="17" data-value="id" data-english="Indonesian">
    <span class="description">Indonesian</span>
    Indonesian
  </div>
  <div class="item" data-percent="12" data-value="lt" data-english="Lithuanian">
    <span class="description">Lietuvių</span>
    Lithuanian
  </div>
  <div class="item" data-percent="11" data-value="tr" data-english="Turkish">
    <span class="description">Türkçe</span>
    Turkish
  </div>
  <div class="item" data-percent="10" data-value="kr" data-english="Korean">
    <span class="description">한국어</span>
    Korean
  </div>
  <div class="item" data-percent="7"  data-value="ar" data-english="Arabic">
    <span class="description">العربية</span>
    Arabic
  </div>
  <div class="item" data-percent="6"  data-value="hu" data-english="Hungarian">
    <span class="description">Magyar</span>
    Hungarian
  </div>
  <div class="item" data-percent="6"  data-value="vi" data-english="Vietnamese">
    <span class="description">tiếng Việt</span>
    Vietnamese
  </div>
  <div class="item" data-percent="5"  data-value="sv" data-english="Swedish">
    <span class="description">svenska</span>
    Swedish
  </div>
  <div class="item" data-precent="4"  data-value="pl" data-english="Polish">
    <span class="description">polski</span>
    Polish
  </div>
  <div class="item" data-percent="6"  data-value="ja" data-english="Japanese">
    <span class="description">日本語</span>
    Japanese
  </div>
  <div class="item" data-percent="0"  data-value="ro" data-english="Romanian">
    <span class="description">românește</span>
    Romanian
  </div>
</div>

          </div>
        </div>
      </div>

      
      
      
      <div class="ui download primary button">
        Download
      </div>
      <div class="ui flowing download basic popup">
        <div class="ui divided equal width relaxed center aligned choice grid">
          <div class="framework column">
            <h4 class="ui center aligned header">UI Framework</h4>
            <div class="ui list">
              <div class="item"><i class="green check icon"></i> Themable</div>
              <div class="item"><i class="green check icon"></i> Build Tools</div>
            </div>
            <div class="ui primary fluid button">Choose</div>
          </div>
          <div class="standalone column">
            <h4 class="ui center aligned header">Standalone</h4>
            <div class="ui list">
              <div class="item">Default Theme</div>
              <div class="item">Precompiled</div>
            </div>
            <div class="ui fluid button basic">Choose</div>
          </div>
        </div>
        <div class="ui divided equal height relaxed center aligned framework grid">
          <div class="column">
            <div class="ui header">Semantic UI</div>
            <a class="ui primary button" href="https://github.com/Semantic-Org/Semantic-UI/archive/master.zip">
              Download ZIP
            </a>
            <a class="ui button" href="/introduction/getting-started.html">Getting Started</a>
            <h4 class="ui header">Package Managers</h4>
            <div class="ui form">
              <div class="field">
                <label>NPM</label>
                <div class="ui fluid input">
                  <input type="text" readonly="readonly" placeholder="Copy Link" value="npm install semantic-ui">
                </div>
              </div>
              <div class="field">
                <label>Git</label>
                <div class="ui fluid input">
                  <input type="text" readonly="readonly" placeholder="Copy Link" value="https://github.com/Semantic-Org/Semantic-UI.git">
                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="ui divided equal height relaxed center aligned standalone grid">
          <div class="column">
            <div class="ui header">Standalone Flag</div>
            <a class="ui primary button" href="https://github.com/Semantic-Org/UI-Flag/archive/master.zip">
              Download ZIP
            </a>
            <a class="ui button" href="https://github.com/Semantic-Org/UI-Flag/">
              View GitHub
            </a>
            <h4 class="ui header">Package Managers</h4>
            <div class="ui form">
              <div class="field">
                <label>Bower</label>
                <div class="ui fluid input">
                  <input type="text" readonly="readonly" placeholder="Copy Link" value="bower install semantic-ui-flag">
                </div>
              </div>
              <div class="field">
                <label>NPM</label>
                <div class="ui fluid input">
                  <input type="text" readonly="readonly" placeholder="Copy Link" value="npm install semantic-ui-flag">
                </div>
              </div>
              <div class="field">
                <label>Git</label>
                <div class="ui fluid input">
                  <input type="text" readonly="readonly" placeholder="Copy Link" value="https://github.com/Semantic-Org/UI-Flag.git">
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      
    </div>
    <div class="advertisement">
      
      <script async type="text/javascript" src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=semanticuicom" id="_carbonads_js"></script>
      
    </div>
    
  </div>
</div>

  <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
  <div class="bsa-cpc"></div>
  <script>
    (function(){
      if(typeof _bsa !== 'undefined' && _bsa) {
      _bsa.init('default', 'CVAIKK7I', 'placement:semanticuicom', {
        target: '.bsa-cpc',
        align: 'horizontal',
        disable_css: 'true'
      });
        }
    })();
  </script>
  <div class="ui vertical beg transition hidden segment">
    <i class="large red delete link icon"></i>
    <div class="ui red header">
      <i class="disabled warning sign icon"></i>
      <div class="content">
        Want to Support Open Source? Whitelist Your Ad-Blocker.
        <div class="sub header">
          We promise to not show more than one small ad per page. Dont worry, hiding this message will make sure you won't get nagged again.
        </div>
      </div>
    </div>
  </div>



<div class="main ui container">

  <div class="ui active tab" data-tab="flags">

    <h2 class="ui header">Definition</h2>

    <div class="no example">
      <h4 class="ui header">Flag</h4>
      <p>A flag can use the two digit country code, the full name, or a common alias</p>
      <div class="code" data-type="html" data-preview="true">
        <i class="ae flag"></i>
        <i class="france flag"></i>
        <i class="myanmar flag"></i>
      </div>
    </div>

    <h2 class="ui header">Types</h2>
    <div class="ui info message">
      <p>Many flag sets use SVG to render flags at multiple sizes. However svg flags usually appear blurry or render improperly at smaller sizes. Semantic's default theme uses an image sprite solution which provides crisper icons, but without the ability to resize</p>
    </div>
    <table class="ui selectable sortable compact celled striped definition table">
      <thead>
        <th class="one wide">Flag</th>
        <th>Name</th>
        <th>ISO 3166-2 Code <a href="http://en.wikipedia.org/wiki/ISO_3166-1_alpha-2">?</a></th>
        <th>Additional Aliases</th>
      </thead>
      <tbody>
      <tr>
        <td><i class="andorra flag"></i></td>
        <td>Andorra</td>
        <td>ad</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="uae flag"></i></td>
        <td>U.A.E</td>
        <td>ae</td>
        <td>United Arab Emirates</td>
      </tr>
      <tr>
        <td><i class="afghanistan flag"></i></td>
        <td>Afghanistan</td>
        <td>af</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="antigua flag"></i></td>
        <td>Antigua</td>
        <td>ag</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="anguilla flag"></i></td>
        <td>Anguilla</td>
        <td>ai</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="albania flag"></i></td>
        <td>Albania</td>
        <td>al</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="armenia flag"></i></td>
        <td>Armenia</td>
        <td>am</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="netherlands antilles flag"></i></td>
        <td>Netherlands Antilles</td>
        <td>an</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="angola flag"></i></td>
        <td>Angola</td>
        <td>ao</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="argentina flag"></i></td>
        <td>Argentina</td>
        <td>ar</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="american samoa flag"></i></td>
        <td>American Samoa</td>
        <td>as</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="austria flag"></i></td>
        <td>Austria</td>
        <td>at</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="australia flag"></i></td>
        <td>Australia</td>
        <td>au</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="aruba flag"></i></td>
        <td>Aruba</td>
        <td>aw</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="aland islands flag"></i></td>
        <td>Aland Islands</td>
        <td>ax</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="azerbaijan flag"></i></td>
        <td>Azerbaijan</td>
        <td>az</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="bosnia flag"></i></td>
        <td>Bosnia</td>
        <td>ba</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="barbados flag"></i></td>
        <td>Barbados</td>
        <td>bb</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="bangladesh flag"></i></td>
        <td>Bangladesh</td>
        <td>bd</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="belgium flag"></i></td>
        <td>Belgium</td>
        <td>be</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="burkina faso flag"></i></td>
        <td>Burkina Faso</td>
        <td>bf</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="bulgaria flag"></i></td>
        <td>Bulgaria</td>
        <td>bg</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="bahrain flag"></i></td>
        <td>Bahrain</td>
        <td>bh</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="burundi flag"></i></td>
        <td>Burundi</td>
        <td>bi</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="benin flag"></i></td>
        <td>Benin</td>
        <td>bj</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="bermuda flag"></i></td>
        <td>Bermuda</td>
        <td>bm</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="brunei flag"></i></td>
        <td>Brunei</td>
        <td>bn</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="bolivia flag"></i></td>
        <td>Bolivia</td>
        <td>bo</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="brazil flag"></i></td>
        <td>Brazil</td>
        <td>br</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="bahamas flag"></i></td>
        <td>Bahamas</td>
        <td>bs</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="bhutan flag"></i></td>
        <td>Bhutan</td>
        <td>bt</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="bouvet island flag"></i></td>
        <td>Bouvet Island</td>
        <td>bv</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="botswana flag"></i></td>
        <td>Botswana</td>
        <td>bw</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="belarus flag"></i></td>
        <td>Belarus</td>
        <td>by</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="belize flag"></i></td>
        <td>Belize</td>
        <td>bz</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="canada flag"></i></td>
        <td>Canada</td>
        <td>ca</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="cocos islands flag"></i></td>
        <td>Cocos Islands</td>
        <td>cc</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="congo flag"></i></td>
        <td>Congo</td>
        <td>cd</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="central african republic flag"></i></td>
        <td>Central African Republic</td>
        <td>cf</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="congo brazzaville flag"></i></td>
        <td>Congo Brazzaville</td>
        <td>cg</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="switzerland flag"></i></td>
        <td>Switzerland</td>
        <td>ch</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="cote divoire flag"></i></td>
        <td>Cote Divoire</td>
        <td>ci</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="cook islands flag"></i></td>
        <td>Cook Islands</td>
        <td>ck</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="chile flag"></i></td>
        <td>Chile</td>
        <td>cl</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="cameroon flag"></i></td>
        <td>Cameroon</td>
        <td>cm</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="china flag"></i></td>
        <td>China</td>
        <td>cn</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="colombia flag"></i></td>
        <td>Colombia</td>
        <td>co</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="costa rica flag"></i></td>
        <td>Costa Rica</td>
        <td>cr</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="serbia flag"></i></td>
        <td>Serbia</td>
        <td>cs</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="cuba flag"></i></td>
        <td>Cuba</td>
        <td>cu</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="cape verde flag"></i></td>
        <td>Cape Verde</td>
        <td>cv</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="christmas island flag"></i></td>
        <td>Christmas Island</td>
        <td>cx</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="cyprus flag"></i></td>
        <td>Cyprus</td>
        <td>cy</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="czech republic flag"></i></td>
        <td>Czech Republic</td>
        <td>cz</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="germany flag"></i></td>
        <td>Germany</td>
        <td>de</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="djibouti flag"></i></td>
        <td>Djibouti</td>
        <td>dj</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="denmark flag"></i></td>
        <td>Denmark</td>
        <td>dk</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="dominica flag"></i></td>
        <td>Dominica</td>
        <td>dm</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="dominican republic flag"></i></td>
        <td>Dominican Republic</td>
        <td>do</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="algeria flag"></i></td>
        <td>Algeria</td>
        <td>dz</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="ecuador flag"></i></td>
        <td>Ecuador</td>
        <td>ec</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="estonia flag"></i></td>
        <td>Estonia</td>
        <td>ee</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="egypt flag"></i></td>
        <td>Egypt</td>
        <td>eg</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="western sahara flag"></i></td>
        <td>Western Sahara</td>
        <td>eh</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="eritrea flag"></i></td>
        <td>Eritrea</td>
        <td>er</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="spain flag"></i></td>
        <td>Spain</td>
        <td>es</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="ethiopia flag"></i></td>
        <td>Ethiopia</td>
        <td>et</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="european union flag"></i></td>
        <td>European Union</td>
        <td>eu</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="finland flag"></i></td>
        <td>Finland</td>
        <td>fi</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="fiji flag"></i></td>
        <td>Fiji</td>
        <td>fj</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="falkland islands flag"></i></td>
        <td>Falkland Islands</td>
        <td>fk</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="micronesia flag"></i></td>
        <td>Micronesia</td>
        <td>fm</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="faroe islands flag"></i></td>
        <td>Faroe Islands</td>
        <td>fo</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="france flag"></i></td>
        <td>France</td>
        <td>fr</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="gabon flag"></i></td>
        <td>Gabon</td>
        <td>ga</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="united kingdom flag"></i></td>
        <td>United Kingdom</td>
        <td>gb uk</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="england flag"></i></td>
        <td>England</td>
        <td>gb eng</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="scotland flag"></i></td>
        <td>Scotland</td>
        <td>gb sct</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="wales flag"></i></td>
        <td>Wales</td>
        <td>gb wls</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="grenada flag"></i></td>
        <td>Grenada</td>
        <td>gd</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="georgia flag"></i></td>
        <td>Georgia</td>
        <td>ge</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="french guiana flag"></i></td>
        <td>French Guiana</td>
        <td>gf</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="ghana flag"></i></td>
        <td>Ghana</td>
        <td>gh</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="gibraltar flag"></i></td>
        <td>Gibraltar</td>
        <td>gi</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="greenland flag"></i></td>
        <td>Greenland</td>
        <td>gl</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="gambia flag"></i></td>
        <td>Gambia</td>
        <td>gm</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="guinea flag"></i></td>
        <td>Guinea</td>
        <td>gn</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="guadeloupe flag"></i></td>
        <td>Guadeloupe</td>
        <td>gp</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="equatorial guinea flag"></i></td>
        <td>Equatorial Guinea</td>
        <td>gq</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="greece flag"></i></td>
        <td>Greece</td>
        <td>gr</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="sandwich islands flag"></i></td>
        <td>Sandwich Islands</td>
        <td>gs</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="guatemala flag"></i></td>
        <td>Guatemala</td>
        <td>gt</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="guam flag"></i></td>
        <td>Guam</td>
        <td>gu</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="guinea-bissau flag"></i></td>
        <td>Guinea-bissau</td>
        <td>gw</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="guyana flag"></i></td>
        <td>Guyana</td>
        <td>gy</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="hong kong flag"></i></td>
        <td>Hong Kong</td>
        <td>hk</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="heard island flag"></i></td>
        <td>Heard Island</td>
        <td>hm</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="honduras flag"></i></td>
        <td>Honduras</td>
        <td>hn</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="croatia flag"></i></td>
        <td>Croatia</td>
        <td>hr</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="haiti flag"></i></td>
        <td>Haiti</td>
        <td>ht</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="hungary flag"></i></td>
        <td>Hungary</td>
        <td>hu</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="indonesia flag"></i></td>
        <td>Indonesia</td>
        <td>id</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="ireland flag"></i></td>
        <td>Ireland</td>
        <td>ie</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="israel flag"></i></td>
        <td>Israel</td>
        <td>il</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="india flag"></i></td>
        <td>India</td>
        <td>in</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="indian ocean territory flag"></i></td>
        <td>Indian Ocean Territory</td>
        <td>io</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="iraq flag"></i></td>
        <td>Iraq</td>
        <td>iq</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="iran flag"></i></td>
        <td>Iran</td>
        <td>ir</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="iceland flag"></i></td>
        <td>Iceland</td>
        <td>is</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="italy flag"></i></td>
        <td>Italy</td>
        <td>it</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="jamaica flag"></i></td>
        <td>Jamaica</td>
        <td>jm</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="jordan flag"></i></td>
        <td>Jordan</td>
        <td>jo</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="japan flag"></i></td>
        <td>Japan</td>
        <td>jp</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="kenya flag"></i></td>
        <td>Kenya</td>
        <td>ke</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="kyrgyzstan flag"></i></td>
        <td>Kyrgyzstan</td>
        <td>kg</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="cambodia flag"></i></td>
        <td>Cambodia</td>
        <td>kh</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="kiribati flag"></i></td>
        <td>Kiribati</td>
        <td>ki</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="comoros flag"></i></td>
        <td>Comoros</td>
        <td>km</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="saint kitts and nevis flag"></i></td>
        <td>Saint Kitts And Nevis</td>
        <td>kn</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="north korea flag"></i></td>
        <td>North Korea</td>
        <td>kp</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="south korea flag"></i></td>
        <td>South Korea</td>
        <td>kr</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="kuwait flag"></i></td>
        <td>Kuwait</td>
        <td>kw</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="cayman islands flag"></i></td>
        <td>Cayman Islands</td>
        <td>ky</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="kazakhstan flag"></i></td>
        <td>Kazakhstan</td>
        <td>kz</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="laos flag"></i></td>
        <td>Laos</td>
        <td>la</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="lebanon flag"></i></td>
        <td>Lebanon</td>
        <td>lb</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="saint lucia flag"></i></td>
        <td>Saint Lucia</td>
        <td>lc</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="liechtenstein flag"></i></td>
        <td>Liechtenstein</td>
        <td>li</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="sri lanka flag"></i></td>
        <td>Sri Lanka</td>
        <td>lk</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="liberia flag"></i></td>
        <td>Liberia</td>
        <td>lr</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="lesotho flag"></i></td>
        <td>Lesotho</td>
        <td>ls</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="lithuania flag"></i></td>
        <td>Lithuania</td>
        <td>lt</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="luxembourg flag"></i></td>
        <td>Luxembourg</td>
        <td>lu</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="latvia flag"></i></td>
        <td>Latvia</td>
        <td>lv</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="libya flag"></i></td>
        <td>Libya</td>
        <td>ly</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="morocco flag"></i></td>
        <td>Morocco</td>
        <td>ma</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="monaco flag"></i></td>
        <td>Monaco</td>
        <td>mc</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="moldova flag"></i></td>
        <td>Moldova</td>
        <td>md</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="montenegro flag"></i></td>
        <td>Montenegro</td>
        <td>me</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="madagascar flag"></i></td>
        <td>Madagascar</td>
        <td>mg</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="marshall islands flag"></i></td>
        <td>Marshall Islands</td>
        <td>mh</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="macedonia flag"></i></td>
        <td>Macedonia</td>
        <td>mk</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="mali flag"></i></td>
        <td>Mali</td>
        <td>ml</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="burma flag"></i></td>
        <td>Burma</td>
        <td>mm</td>
        <td>Myanmar</td>
      </tr>
      <tr>
        <td><i class="mongolia flag"></i></td>
        <td>Mongolia</td>
        <td>mn</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="macau flag"></i></td>
        <td>Macau</td>
        <td>mo</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="northern mariana islands flag"></i></td>
        <td>Northern Mariana Islands</td>
        <td>mp</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="martinique flag"></i></td>
        <td>Martinique</td>
        <td>mq</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="mauritania flag"></i></td>
        <td>Mauritania</td>
        <td>mr</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="montserrat flag"></i></td>
        <td>Montserrat</td>
        <td>ms</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="malta flag"></i></td>
        <td>Malta</td>
        <td>mt</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="mauritius flag"></i></td>
        <td>Mauritius</td>
        <td>mu</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="maldives flag"></i></td>
        <td>Maldives</td>
        <td>mv</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="malawi flag"></i></td>
        <td>Malawi</td>
        <td>mw</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="mexico flag"></i></td>
        <td>Mexico</td>
        <td>mx</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="malaysia flag"></i></td>
        <td>Malaysia</td>
        <td>my</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="mozambique flag"></i></td>
        <td>Mozambique</td>
        <td>mz</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="namibia flag"></i></td>
        <td>Namibia</td>
        <td>na</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="new caledonia flag"></i></td>
        <td>New Caledonia</td>
        <td>nc</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="niger flag"></i></td>
        <td>Niger</td>
        <td>ne</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="norfolk island flag"></i></td>
        <td>Norfolk Island</td>
        <td>nf</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="nigeria flag"></i></td>
        <td>Nigeria</td>
        <td>ng</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="nicaragua flag"></i></td>
        <td>Nicaragua</td>
        <td>ni</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="netherlands flag"></i></td>
        <td>Netherlands</td>
        <td>nl</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="norway flag"></i></td>
        <td>Norway</td>
        <td>no</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="nepal flag"></i></td>
        <td>Nepal</td>
        <td>np</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="nauru flag"></i></td>
        <td>Nauru</td>
        <td>nr</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="niue flag"></i></td>
        <td>Niue</td>
        <td>nu</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="new zealand flag"></i></td>
        <td>New Zealand</td>
        <td>nz</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="oman flag"></i></td>
        <td>Oman</td>
        <td>om</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="panama flag"></i></td>
        <td>Panama</td>
        <td>pa</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="peru flag"></i></td>
        <td>Peru</td>
        <td>pe</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="french polynesia flag"></i></td>
        <td>French Polynesia</td>
        <td>pf</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="new guinea flag"></i></td>
        <td>New Guinea</td>
        <td>pg</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="philippines flag"></i></td>
        <td>Philippines</td>
        <td>ph</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="pakistan flag"></i></td>
        <td>Pakistan</td>
        <td>pk</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="poland flag"></i></td>
        <td>Poland</td>
        <td>pl</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="saint pierre flag"></i></td>
        <td>Saint Pierre</td>
        <td>pm</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="pitcairn islands flag"></i></td>
        <td>Pitcairn Islands</td>
        <td>pn</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="puerto rico flag"></i></td>
        <td>Puerto Rico</td>
        <td>pr</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="palestine flag"></i></td>
        <td>Palestine</td>
        <td>ps</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="portugal flag"></i></td>
        <td>Portugal</td>
        <td>pt</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="palau flag"></i></td>
        <td>Palau</td>
        <td>pw</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="paraguay flag"></i></td>
        <td>Paraguay</td>
        <td>py</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="qatar flag"></i></td>
        <td>Qatar</td>
        <td>qa</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="reunion flag"></i></td>
        <td>Reunion</td>
        <td>re</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="romania flag"></i></td>
        <td>Romania</td>
        <td>ro</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="serbia flag"></i></td>
        <td>Serbia</td>
        <td>rs</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="russia flag"></i></td>
        <td>Russia</td>
        <td>ru</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="rwanda flag"></i></td>
        <td>Rwanda</td>
        <td>rw</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="saudi arabia flag"></i></td>
        <td>Saudi Arabia</td>
        <td>sa</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="solomon islands flag"></i></td>
        <td>Solomon Islands</td>
        <td>sb</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="seychelles flag"></i></td>
        <td>Seychelles</td>
        <td>sc</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="sudan flag"></i></td>
        <td>Sudan</td>
        <td>sd</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="sweden flag"></i></td>
        <td>Sweden</td>
        <td>se</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="singapore flag"></i></td>
        <td>Singapore</td>
        <td>sg</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="saint helena flag"></i></td>
        <td>Saint Helena</td>
        <td>sh</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="slovenia flag"></i></td>
        <td>Slovenia</td>
        <td>si</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="jan mayen flag"></i></td>
        <td>Jan Mayen</td>
        <td>sj</td>
        <td>Svalbard</td>
      </tr>
      <tr>
        <td><i class="slovakia flag"></i></td>
        <td>Slovakia</td>
        <td>sk</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="sierra leone flag"></i></td>
        <td>Sierra Leone</td>
        <td>sl</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="san marino flag"></i></td>
        <td>San Marino</td>
        <td>sm</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="senegal flag"></i></td>
        <td>Senegal</td>
        <td>sn</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="somalia flag"></i></td>
        <td>Somalia</td>
        <td>so</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="suriname flag"></i></td>
        <td>Suriname</td>
        <td>sr</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="sao tome flag"></i></td>
        <td>Sao Tome</td>
        <td>st</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="el salvador flag"></i></td>
        <td>El Salvador</td>
        <td>sv</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="syria flag"></i></td>
        <td>Syria</td>
        <td>sy</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="swaziland flag"></i></td>
        <td>Swaziland</td>
        <td>sz</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="caicos islands flag"></i></td>
        <td>Caicos Islands</td>
        <td>tc</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="chad flag"></i></td>
        <td>Chad</td>
        <td>td</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="french territories flag"></i></td>
        <td>French Territories</td>
        <td>tf</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="togo flag"></i></td>
        <td>Togo</td>
        <td>tg</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="thailand flag"></i></td>
        <td>Thailand</td>
        <td>th</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="tajikistan flag"></i></td>
        <td>Tajikistan</td>
        <td>tj</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="tokelau flag"></i></td>
        <td>Tokelau</td>
        <td>tk</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="timorleste flag"></i></td>
        <td>Timorleste</td>
        <td>tl</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="turkmenistan flag"></i></td>
        <td>Turkmenistan</td>
        <td>tm</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="tunisia flag"></i></td>
        <td>Tunisia</td>
        <td>tn</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="tonga flag"></i></td>
        <td>Tonga</td>
        <td>to</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="turkey flag"></i></td>
        <td>Turkey</td>
        <td>tr</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="trinidad flag"></i></td>
        <td>Trinidad</td>
        <td>tt</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="tuvalu flag"></i></td>
        <td>Tuvalu</td>
        <td>tv</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="taiwan flag"></i></td>
        <td>Taiwan</td>
        <td>tw</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="tanzania flag"></i></td>
        <td>Tanzania</td>
        <td>tz</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="ukraine flag"></i></td>
        <td>Ukraine</td>
        <td>ua</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="uganda flag"></i></td>
        <td>Uganda</td>
        <td>ug</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="us minor islands flag"></i></td>
        <td>Us Minor Islands</td>
        <td>um</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="united states flag"></i></td>
        <td>United States</td>
        <td>us</td>
        <td>America</td>
      </tr>
      <tr>
        <td><i class="uruguay flag"></i></td>
        <td>Uruguay</td>
        <td>uy</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="uzbekistan flag"></i></td>
        <td>Uzbekistan</td>
        <td>uz</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="vatican city flag"></i></td>
        <td>Vatican City</td>
        <td>va</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="saint vincent flag"></i></td>
        <td>Saint Vincent</td>
        <td>vc</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="venezuela flag"></i></td>
        <td>Venezuela</td>
        <td>ve</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="british virgin islands flag"></i></td>
        <td>British Virgin Islands</td>
        <td>vg</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="us virgin islands flag"></i></td>
        <td>Us Virgin Islands</td>
        <td>vi</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="vietnam flag"></i></td>
        <td>Vietnam</td>
        <td>vn</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="vanuatu flag"></i></td>
        <td>Vanuatu</td>
        <td>vu</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="wallis and futuna flag"></i></td>
        <td>Wallis And Futuna</td>
        <td>wf</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="samoa flag"></i></td>
        <td>Samoa</td>
        <td>ws</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="yemen flag"></i></td>
        <td>Yemen</td>
        <td>ye</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="mayotte flag"></i></td>
        <td>Mayotte</td>
        <td>yt</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="south africa flag"></i></td>
        <td>South Africa</td>
        <td>za</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="zambia flag"></i></td>
        <td>Zambia</td>
        <td>zm</td>
        <td class="disabled"></td>
      </tr>
      <tr>
        <td><i class="zimbabwe flag"></i></td>
        <td>Zimbabwe</td>
        <td>zw</td>
        <td class="disabled"></td>
      </tr>
      </tbody>
    </table>

  </div>
</div>
        <div class="ui  vertical footer segment">
  <div class="ui center aligned container">
    <div class="ui stackable grid">
      <div class="three wide column">
        <h4 class="ui header">Community</h4>
        <div class="ui link list">
          <a class="item" href="https://www.transifex.com/organization/semantic-org/" target="_blank">Help Translate</a>
          <a class="item" href="https://github.com/Semantic-Org/Semantic-UI/issues" target="_blank">Submit an Issue</a>
          <a class="item" href="https://gitter.im/Semantic-Org/Semantic-UI" target="_blank">Join our Chat</a>
          <a class="item" href="/cla.html" target="_blank">CLA</a>
        </div>
      </div>
      <div class="three wide column">
        <h4 class="ui header">Network</h4>
        <div class="ui link list">
          <a class="item" href="https://github.com/Semantic-Org/Semantic-UI" target="_blank">GitHub Repo</a>
          <a class="item" href="http://forums.semantic-ui.com" target="_blank">User Forums</a>
          <a class="item" href="http://1.semantic-ui.com">1.x Docs</a>
          <a class="item" href="http://legacy.semantic-ui.com">0.x Docs</a>
        </div>
      </div>
      <div class="seven wide right floated column">
        <h4 class="ui header">Help Preserve This Project</h4>
        <p> Support for the continued development of Semantic UI comes directly from the community.</p>
        <form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
          <input type="hidden" name="cmd" value="_s-xclick">
          <input type="hidden" name="hosted_button_id" value="7ZAF2Q8DBZAQL">
          <button type="submit" class="ui large teal button">Donate Today</button>
        </form>
      </div>
    </div>
    <div class="ui section divider"></div>
    <img src="/images/logo.png" class="ui centered mini image">
    <div class="ui horizontal small divided link list">
      <a class="item" href="http://semantic-ui.mit-license.org/" target="_blank">Free & Open Source (MIT)</a>
    </div>
  </div>
</div>

      </div>
    </div>
  </div>
  <div class="ui basic language modal">
  <i class="close icon"></i>
  <div class="header">The <span class="name"></span> Translation Needs Your Help</div>
  <div class="image content">
    <div class="middle aligned image">
      <i class="world icon"></i>
    </div>
    <div class="description">
      <p>This translation is only <b><span class="complete"></span>%</b> complete!</p>
      <div class="ui inverted indicating progress">
        <div class="bar"></div>
      </div>
      <p>We need your help to make Semantic available to  people who speak your language.</p>
      <p>Our translation tools are easy to use and allow you to translate text without having to leave the site.
      </p>
    </div>
  </div>
  <div class="actions">
    <div class="ui inverted cancel button">No Thanks</div>
    <a href="https://github.com/Semantic-Org/Semantic-UI/wiki/Translating-Semantic-UI-Docs" target="_blank" class="ui inverted approve teal button">
      <i class="mail icon"></i>
      Help Translate
    </a>
  </div>
</div>

<div class="ui basic chinese modal">
  <i class="close icon"></i>
  <div class="header">Would you like to visit the mirror site?</div>
  <div class="image content">
    <div class="middle aligned image">
      <i class="question icon"></i>
    </div>
    <div class="description">
      <p>Semantic is available at <a href="http://www.semantic-ui.cn">semantic-ui.cn</a> a mirror site hosted inside China. This should make browsing much faster for those visiting from mainland China.
      </p>
    </div>
  </div>
  <div class="actions">
    <div class="ui inverted red cancel button">No Thanks</div>
    <a href="http://www.semantic-ui.cn" class="ui inverted green approve button">
      <i class="mail icon"></i>
      Yes, take me to the mirror
    </a>
  </div>
</div>
  <div class="ui demo page dimmer">
  <div class="content">
    <div class="center">
      <h2 class="ui inverted icon header">
        <i class="mail icon"></i>
        Dimmer Message
        <div class="sub header">Dimmer sub-header</div>
      </h2>
    </div>
  </div>
</div>
  <script>
window.less = {
  async        : true,
  environment  : 'production',
  fileAsync    : false,
  onReady      : false,
  useFileCache : true
};
</script>

<script src="/javascript/library/less.min.js"></script>


</body>
</html>
